import { Meta } from '@storybook/blocks';

import * as DrawerStories from '../stories/Drawer.stories';

<Meta of={DrawerStories} />

# Drawer

A material design panel that slides in horizontally from the edge of a Scaffold to show navigation links in an application.

## Example

```dart liveslice=Drawer mockup=iPhone7
@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text('Drawer Sample'),
    ),
    drawer: Drawer(
      child: ListView(
        children: <Widget>[
          DrawerHeader(
            decoration: BoxDecoration(
              color: Colors.grey,
            ),
            child: Center(
              child: SizedBox(
                width: 60.0,
                height: 60.0,
                child: CircleAvatar(
                  child: FlutterLogo(),
                ),
              ),
            ),
          ),
          ListTile(
            leading: Icon(Icons.change_history),
            title: Text('Change history'),
            onTap: () {
              // change app state...
              Navigator.pop(context); // close the drawer
            },
          )
        ],
      ),
    ),
  );
}
```

## Related Links

- https://api.flutter.dev/flutter/material/Drawer-class.html
